<!DOCTYPE html>
<!-- This Source Code Form is subject to the terms of the Mozilla Public
   - License, v. 2.0. If a copy of the MPL was not distributed with this
   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="theme-color" content="#75AACF">
    <title data-l10n-id="local-token-title">Local Token Service - WebThings Gateway</title>
    <link rel="manifest" href="/app.webmanifest">
    <link rel="icon" href="/optimized-images/icon.png" type="image/png" />

    <link rel="stylesheet" type="text/css" href="/css/lib/highlight-9.12.0.min.css">
    <link rel="stylesheet" type="text/css" href="/css/app.css" />
    <link rel="stylesheet" type="text/css" href="/css/thing.css" />
    <link rel="stylesheet" type="text/css" href="/css/local-token-service.css" />
  </head>
  <body class="hidden">
    <img id="wordmark" src="../optimized-images/wordmark.svg" data-l10n-id="wordmark"/>

    <!-- OAuth Authorization -->
    <section class="selected">
      <div class="title-bar">
        <a href="/" class="back-button icon-button"></a>
        <h1 data-l10n-id="local-token-header"></h1>
      </div>

      <div class="main-container">
        <span data-l10n-id="local-token-your-token"></span> <a href="https://jwt.io/" data-l10n-id="local-token-jwt"></a>:
        <br/>
        <br/>
        <code id="token">{{token}}</code>
        <br/>
        <span data-l10n-id="local-token-use-it"></span> <a
        href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Authorization" data-l10n-id="local-token-bearer-type"></a>.
        <br/>
        <br/>
        <div class="code-example">
          <h3>Curl</h3>
          <pre>
            <code class="bash">
curl -H "Authorization: Bearer {{token}}" \
  -H "Accept: application/json" <span class="insecure">--insecure</span> \
  <span class="origin">https://gateway.local</span>/things
            </code>
          </pre>
        </div>

        <div class="code-example">
          <h3>JavaScript: Fetch API</h3>
          <pre>
            <code class="javascript">
fetch('<span class="origin">https://gateway.local</span>/things', {
  headers: {
    Accept: 'application/json',
    Authorization: 'Bearer {{token}}'
  }
}).then(res =&gt; {
  return res.json();
}).then(things =&gt; {
  console.log(things);
});
            </code>
          </pre>
        </div>

        <div class="code-example">
          <h3>JavaScript: XMLHttpRequest</h3>
          <pre>
            <code class="javascript">
var xhr = new XMLHttpRequest();
xhr.addEventListener('load', function() {
  console.log(this.responseText);
});
xhr.open('GET', '<span class="origin">https://gateway.local</span>/things');
xhr.setRequestHeader('Accept', 'application/json');
xhr.setRequestHeader('Authorization', 'Bearer {{token}}');
xhr.send();
            </code>
          </pre>
        </div>

        <div class="code-example">
          <h3>Python</h3>
          <pre>
            <code class="python">
import requests
r = requests.get('<span class="origin">https://gateway.local</span>/things', headers={
  'Accept': 'application/json',
  'Authorization': 'Bearer {{token}}'
}<span class="insecure">, verify=False</span>)
print r.text
            </code>
          </pre>
        </div>

        <div class="code-example">
          <h3>Rust</h3>
          <pre>
            <code class="rust">
<span class="insecure">
let client = reqwest::Client::builder()
    .danger_disable_hostname_verification()
    .build().unwrap();
</span><span class="secure">
let client = reqwest::Client::new();
</span>

let text = client.get("<span class="origin">https://gateway.local</span>/things")
    .header(reqwest::header::Accept::json())
    .header(
        reqwest::header::Authorization(
            reqwest::header::Bearer {
                token: "{{token}}".to_string()
            }
        )
    )
    .send().unwrap().text().unwrap();
            </code>
          </pre>
        </div>
      </div>
    </section>
    <script>
if ({{oauthPostToken}}) {
  window.addEventListener("message", function(ev) {
   if (ev.origin !== 'file://') {
     return;
   }
   if (ev.data.message === "token") {
      ev.source.postMessage({ message: { token: "{{token}}" }}, "*");
    }
  });
}
    </script>
  </body>
</html>
